<template>
	<view class="tabbar-list">
		<view class="tabbar-list-item" @click="goToPage('/pages/tabbar-3-detial/tabbar-3-release/tabbar-3-release')">
			<image class="list-image" src="../../../static/img/release.png" mode="aspectFit"></image>
			<text class="list-text">发图文</text>
		</view>
		<view class="tabbar-list-item" @click="goToPage('/pages/tabbar-3-detial/tabbar-3-video/tabbar-3-video')">
			<image class="list-image" src="../../../static/img/video.png" mode="aspectFit"></image>
			<text class="list-text">发视频</text>
		</view>
	</view>
</template> 

<script setup>
const goToPage = (url) => {
  if (!url) return
  uni.navigateTo({
    url
  })
}
</script>

<style lang="scss" scoped>

.tabbar-list {
	display: flex;
	justify-content: space-around;
	align-items: center;
	width: 90%;
	margin: 40upx 5%;
	box-sizing: border-box;
	
	.tabbar-list-item {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 40vw;
		height: 40vw;
		background: #fff;
		border-radius: 15upx;
		box-shadow: 0 2px 5px rgba(0,0,0,0.1);
		
		.list-image {
			width: 120upx;
			height: 120upx;
			margin-bottom: 30upx;
		}
		
		.list-text {
			font-size: $uni-font-size-lg;
			color: $uni-text-color;
			font-weight: bold;
		}
	}
}
</style>
